<template>
  <div class="course-play">
    <!-- 文档预览 -->
    <PlayFile
      :row="row"
      :resource="resource"
      v-if="type == 31 && showType == 0"
    />
    <!-- 图片预览 -->
    <PlayImg
      :row="row"
      :resource="resource"
      v-if="type == 31 && showType == 1"
    />
    <!-- 音频预览 -->
    <PlayAudio
      :row="row"
      :resource="resource"
      v-if="type == 31 && showType == 2"
    />
    <!-- 视频预览 -->
    <PlayVideo
      :row="row"
      :resource="resource"
      v-if="type == 31 && showType == 3"
    />
    <!-- 作业 -->
    <PlayHomework :row="row" :resource="resource" v-if="type == 32" />
    <!-- 实验课 -->
    <PlayExperiment :row="row" :resource="resource" v-if="type == 33" />
    <!-- 考试 -->
    <PlayExam :row="row" :resource="resource" v-if="type == 34" />
  </div>
</template>
<script>
export default {
  components: {
    PlayFile: () => import('./PlayFile.vue'),
    PlayImg: () => import('./PlayImg.vue'),
    PlayAudio: () => import('./PlayAudio.vue'),
    PlayVideo: () => import('./PlayVideo.vue'),
    PlayHomework: () => import('./PlayHomework.vue'),
    PlayExperiment: () => import('./PlayExperiment.vue'),
    PlayExam: () => import('./PlayExam.vue'),
  },
  data() {
    return {
      type: 31, //31-内容(图片，视频，音频),32-作业,33-实验课,34-考试
      showType: 0, //0-文档,1-图片,2-音频,3-视频
      row: {},
      resource: {},
    }
  },
  mounted() {
    this.$bus.$on('sendResourceInfo', (v) => {
      this.row = v
      this.type = this.row.type
      if (!v.field1) return
      this.resource = JSON.parse(v.field1)
      if (typeof v.field1 == 'string') {
        let { showType } = this.resource
        this.showType = showType
      }
    })
  },
  beforeDestroy() {
    this.$bus.$off('sendResourceInfo')
  },
  methods: {},
}
</script>
<style scoped lang="scss">
.course-play {
  position: relative;
  width: 100%;
  height: 100%;
  background: #000;
}
</style>